<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>欢迎您登录商家系统</title>
        <link rel="stylesheet" type="text/css" href="__PUBLIC__/Admin/css/login.css" media="all">
        <link rel="stylesheet" type="text/css" href="__PUBLIC__/Admin/css/{$Think.config.COLOR_STYLE}.css" media="all">
    </head>
    <body id="login-page" style="height: 100%;">
        <div id="main-content">
           <div class="wellcom">商家系统，欢迎您！</div>
            <!-- 主体 -->
            <div class="login-body">
                <div class="login-main pr">
                    <form action="{:U('updatePassword')}" method="post" class="login-form">
                        <h3 class="welcome">密码修改</h3>
                        <div id="itemBox" class="item-box">
                            <div class="item">
                                <i class="icon-login-user"></i>
                                <input type="password" name="old" placeholder="旧密码" autocomplete="off" />
                            </div>
                            <span class="placeholder_copy placeholder_un">请旧密码</span>

                            <div class="item b0">
                                <i class="icon-login-pwd"></i>
                                <input type="password" name="password" placeholder="请填写密码" autocomplete="off" />
                            </div>
                            <span class="placeholder_copy placeholder_pwd">请填写密码</span>

                            <div class="item b0">
                                <i class="icon-login-pwd"></i>
                                <input type="password" name="repassword" placeholder="确认密码" autocomplete="off" />
                            </div>
                            <span class="placeholder_copy placeholder_pwd">请确认密码</span>

                        </div>
                        <div class="login_btn_panel">
                            <input type="hidden" name="uid" value="{:is_login()}" />

                            <button class="login-btn" type="submit">
                                <span class="in"><i class="icon-loading"></i>提 交 中 ...</span>
                                <span class="on">提交</span>
                            </button>
                            <div class="check-tips"></div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    <!--[if lt IE 9]>
    <script type="text/javascript" src="__STATIC__/jquery-1.10.2.min.js"></script>
    <![endif]-->
    <!--[if gte IE 9]><!-->
    <script type="text/javascript" src="__STATIC__/jquery-2.0.3.min.js"></script>
    <!--<![endif]-->
    <script type="text/javascript">
        /* 登陆表单获取焦点变色 */
        $(".login-form").on("focus", "input", function(){
            $(this).closest('.item').addClass('focus');
        }).on("blur","input",function(){
            $(this).closest('.item').removeClass('focus');
        });

        //表单提交
        $(document)
            .ajaxStart(function(){
                $("button:submit").addClass("log-in").attr("disabled", true);
            })
            .ajaxStop(function(){
                $("button:submit").removeClass("log-in").attr("disabled", false);
            });

        $("form").submit(function(){
            var self = $(this);
            $.post(self.attr("action"), self.serialize(), success, "json");
            return false;

            function success(data){
                if(data.status){
                    window.location.href = data.url;
                } else {
                    self.find(".check-tips").text(data.info);
                }
            }
        });

        $(function(){
            //初始化选中用户名输入框
            $("#itemBox").find("input[name=username]").focus();
            
            //placeholder兼容性
                //如果支持 
            function isPlaceholer(){
                var input = document.createElement('input');
                return "placeholder" in input;
            }
                //如果不支持
            if(!isPlaceholer()){
                $(".placeholder_copy").css({
                    display:'block'
                })
                $("#itemBox input").keydown(function(){
                    $(this).parents(".item").next(".placeholder_copy").css({
                        display:'none'
                    })                    
                })
                $("#itemBox input").blur(function(){
                    if($(this).val()==""){
                        $(this).parents(".item").next(".placeholder_copy").css({
                            display:'block'
                        })                      
                    }
                })
                
                
            }
        });
    </script>
</body>
</html>
